
<template>
  <div class="set_commission-container">
    <breadcrumb style></breadcrumb>
    <div class="content">
      <el-main>
        <div class="box">
          <el-row class="row">
            <el-col :span="6">
              <div class="grid-content bg-purple">
                拼团返利：
                <span>七折，五折，情怀，全场9.9</span>
              </div>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light"></div>
            </el-col>
          </el-row>
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">直推团队消费返利:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input3"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">%</div>
            </el-col>
          </el-row>
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">间推团队消费返利:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input4"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">%</div>
            </el-col>
          </el-row>
        </div>
        <div class="box">
          <el-row class="row">
            <el-col :span="6">
              <div class="grid-content bg-purple">佣金提现</div>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light"></div>
            </el-col>
          </el-row>
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">钻石账户最低提现金额:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input8"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">元</div>
            </el-col>
          </el-row>
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">银行卡账户最低提现金额:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input5"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">元</div>
            </el-col>
          </el-row>
        </div>
        <div class="box">
          <el-row class="row">
            <el-col :span="6">
              <div class="grid-content bg-purple">提现次数设置:</div>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light"></div>
            </el-col>
          </el-row>
          <!-- <el-row class="row1">
  <el-col :span="3"><div class="grid-content bg-purple">钻石账户每月可提现:</div></el-col>
  <el-col :span="1"><div class="grid-content bg-purple"><el-input v-model="input6"></el-input></div></el-col>
  <el-col :span="1"><div class="grid-content bg-purple">  次</div></el-col>
          </el-row>-->
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">银行卡账户每月可提现:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input7"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">次</div>
            </el-col>
          </el-row>
        </div>
        <div class="box">
          <el-row class="row">
            <el-col :span="6">
              <div class="grid-content bg-purple">提现手续费费率:</div>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light"></div>
            </el-col>
          </el-row>
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">提现到钻石:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input9"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">%</div>
            </el-col>
          </el-row>
          <el-row class="row1">
            <el-col :span="3">
              <div class="grid-content bg-purple">提现到银行卡:</div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">
                <el-input v-model="input10"></el-input>
              </div>
            </el-col>
            <el-col :span="1">
              <div class="grid-content bg-purple">%</div>
            </el-col>
          </el-row>
        </div>
        <el-footer>
          <el-button type="primary" @click="set_commission">确 定</el-button>
          <el-button style="color: #409eff" @click="$router.go(-1)">取 消</el-button>
        </el-footer>
      </el-main>
    </div>
  </div>
</template>


<script>
import breadcrumb from "../../components/breadcrumb";
import {
  commission_set_see,
  commission_set_modify
} from "../../api/getData.js";
export default {
  components: { breadcrumb },
  data() {
    return {
      activeName: ["1"],
      buyCashback: "", // 一级团队消费返利
      buyRecashback: "", //  二级团队消费返利
      cashback: "", // vip邀请返利
      recashback: "", //  二级团队vip充值返利
      input: "", //免单到账时间
      input2: "", //拼团消费到账时间
      input3: "", //一级团队消费返利
      input4: "", //二级团队消费返利
      input5: "", //银行卡账户最低提现金额
      input6: "", //钻石账户每月可提现
      input7: "", //银行卡每月可提现金额
      input8: "", //钻石账户最低提现金额
      id: "", //添加佣金的id
      input9: "", //提现到钻石费率
      input10: "" //提现到银行卡费率
    };
  },
  created() {
    this.get_commissiong_detail();
  },
  methods: {
    set_commission() {
      if(!isNaN(this.input3)&&!isNaN(this.input4)&&!isNaN(this.input5)&&!isNaN(this.input7)&&!isNaN(this.input8)&&!isNaN(this.input9)&&!isNaN(this.input10)){
          let data =
            "oneLevelRebate=" +
            this.input3 +
            "&twoLevelRebate=" +
            this.input4 +
            "&bankCash=" +
            this.input5 +
            "&bankNum=" +
            this.input7 +
            "&diamondsCase=" +
            this.input8 +
            "&diamondsRebate=" +
            this.input9 +
            "&bankRebate=" +
            this.input10;
          this.$axios.post("/web_audit/update_audit", data).then(res => {
            if (res.data.data == 1) {
              this.get_commissiong_detail();
              return this.$message.success("修改成功");
            } else {
              this.$message({
                type: "warning",
                message: "修改失败"
              });
            }
          });
      }else{
        this.get_commissiong_detail();
        this.$message({
                type: "warning",
                message: "请输入数字"
              });
          }  
    },
    async get_commissiong_detail() {
      const { data: res } = await this.$axios.post("/web_audit/select_audit");
      this.input3 = res.data.oneLevelRebate * 100;
      this.input4 = res.data.twoLevelRebate * 100;
      this.input5 = res.data.bankCash;
      this.input6 = res.data.diamondsNum;
      this.input7 = res.data.bankNum;
      this.input8 = res.data.diamondsCase;
      this.input9 = res.data.diamondsRebate * 100;
      this.input10 = res.data.bankRebate * 100;
    }
  }
};
</script>



<style lang="less">
.set_commission-container {
  @import "../../style/card.less";
  display: flex;
  flex-flow: column;
  height: 100%;
  .price {
    width: 70px !important;
    .el-input__inner {
      width: 70px !important;
    }
  }
  .el-collapse-item {
    .el-collapse-item__content {
      padding-left: 45px;
      display: flex;
      .el-form {
        width: 310px;
        display: flex;
        flex-direction: column;
        margin-right: 85px;
        .el-form-item {
          margin-bottom: 30px !important;
        }
      }
    }
  }
  .box {
    // background-color: #eee;
    margin: 5px 0;
  }
  .box > .row {
    font-size: 18px;
    font-weight: 600;
  }
  .box > .row1 {
    font-size: 14px;
    font-weight: 400;
  }
  .box > .row1 .el-input__inner {
    // width: 40px;
    height: 30px;
  }
  .box > .row span {
    display: inline-block;
    color: red;
  }
  .el-row {
    // margin-bottom: 20px;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .el-col {
    min-width: 110px;
    border-radius: 4px;
  }
  .bg-purple-dark {
    // background: #99a9bf;
  }
  .bg-purple {
    // background: #d3dce6;
  }
  .bg-purple-light {
    // background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
    line-height: 36px;
    min-width: 40px;
  }
  .grid-content > .bg-purple {
  }
  .row-bg {
    // padding: 10px 0;
    background-color: #f9fafc;
  }
}
</style>
